<!--Author: Boby Wang-->
<!-- Author: Fuduo Chen -->
<!--  CSC  337  -->
<!--Description: This page is building a web page that shows user's all infomation.-->
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>infomation</title>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
	<div id='allinfo'>
		<div id = "followingList"></div>
		<div id = "introSection">
			<img src = "/img/questionMark.png" id = "portrait" onclick="addPortrait()" style = "border-radius: 50%; float:right; width: 100px; cursor: pointer;" alt="portrait"/>
			<div><span class = "infoDetails">username:		</span>	<span id = "username">	g</span></div>
			<div id = "password"><button onclick = "changePassword()">change password</button></div>
			<div><span class = "infoDetails">Gender:		</span>	<span id = "gender">	g</span></div>
			<div><span class = "infoDetails">Age:			</span>	<span id = "age">		a</span></div>
			<div><span class = "infoDetails">Hobby:		</span>	<span id = "hobby">		h</span></div>
			<div><span class = "infoDetails" onclick = "checkFollowing()" style="cursor:pointer;">following:		</span>	<span id = "following">		h</span></div>
			<div><span class = "infoDetails">follower:		</span>	<span id = "follower">		h</span></div>
			<form action = "/uploadSelfPortrait" id="FileUpload" method="post" enctype="multipart/form-data" style = "float:right; ">	
				<input type = "file" id="FileUpload1" accept = "image/*" name = "portrait" onchange = "loadFile(event)" style="display: none;" />
				<input type = "submit" id="FileUpload2" value = "upload portrait" style = "width:100px;display: none;" >
			</form>
			<span class = "infoDetails">Introduction:	</span>	
			<div id = "introOut">
				<div id = "intro">	i</div>
				<!-- <button onclick = "unfollow()" >Unfollow</button>
				<button onclick = "follow()" style = "float: right">Follow</button> -->
			</div>
			<div id="edit">
				<button type=button onclick="location.href='main.html'" style = "margin-left:180px;">back</button>
				<button onclick="editInfo()" style = "margin-left:10px;">edit</button>
			</div>
		</div>
	</div>
	
	
	<script src = "info.js"></script>
	</body>
</html>
